<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      id="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
      name="viewport"
    />
    <meta name="theme-color" content="#000000" />
    <meta name="referrer" content="never"> 
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <!-- <link
      href="http://cdn.bootcss.com/highlight.js/8.0/styles/monokai_sublime.min.css"
      rel="stylesheet"
    /> -->
    <link rel="stylesheet" href="./css/monokai_sublime.css" />
    <title id="title">BiaoChenXuYing 的个人博客网站</title>
    <meta name="baidu-site-verification" content="7XGPmF2RtW" />
    <meta id="keywords" name="keywords" content="BiaoChenXuYing 的博客网站" />
    <meta
      id="description"
      name="description"
      content="BiaoChenXuYing 的博客网站。BiaoChenXuYing，目前是一名前端开发工程师，BiaoChenXuYing 公众号作者，致力于前端和后端开发、全栈程序员的成长之路。"
    />
  </head>
  <body>
    <div id="root">
      <!-- 首屏加载动画 -->
      <div style="text-align: center; height: 300px; margin-top: 15%">
        <img src="./img/loading.svg" width="250" alt="加载中..." />
      </div>
    </div>
  </body>
  <script>
    // 设置移动端单位自适应，移动端通用的单位为 rem。
    document.getElementsByTagName('html')[0].style.fontSize =
      window.screen.width / 7.5 + 'px';
    // 如上：通过查询屏幕宽度，动态的设置 html 的 font-size 值，设计稿大多以 750*1334 设置的，通过上述换算后，在设计图上一张 150*150 px 的图，在 css 中对应的 rem 值则为：1.5*1.5 rem
  </script>
</html>
